﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>学生成绩管理系统</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="login">
    <meta name="author" content="cql">
    <!-- Le styles -->
    <link href="./css/bootstrap.min.css" rel="stylesheet">
    <style type="text/css">
        body
        {
            padding-top: 40px;
            padding-bottom: 40px;
            background-color: #f5f5f5;
        }
        
        .form-signin
        {
            max-width: 300px;
            padding: 19px 29px 29px;
            margin: 0 auto 20px;
            background-color: #fff;
            border: 1px solid #e5e5e5;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
            -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
            -moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
            box-shadow: 0 1px 2px rgba(0,0,0,.05);
        }
        .form-signin .form-signin-heading, .form-signin .checkbox
        {
            margin-bottom: 10px;
        }
        .form-signin input[type="text"], .form-signin input[type="password"]
        {
            font-size: 16px;
            height: auto;
            margin-bottom: 15px;
            padding: 7px 9px;
        }
    </style>
    <link href="./css/bootstrap-responsive.min.css" rel="stylesheet">
    <link href="css/messenger-theme-future.css" rel="stylesheet" type="text/css" />
    <link href="css/messenger.css" rel="stylesheet" type="text/css" />
    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="//cdnjs.bootcss.com/ajax/libs/html5shiv/3.6.2/html5shiv.js"></script>
    <![endif]-->
    <!-- Fav and touch icons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
    <link rel="shortcut icon" href="../assets/ico/favicon.png">
</head>
<body>
    <div class="container">
        <form class="form-signin">
        <h2 class="form-signin-heading">
            请登录</h2>
        <input id="username" type="text" class="input-block-level" placeholder="账号">
        <input id="password" type="password" class="input-block-level" placeholder="密码">
        <label class="checkbox">
            <input type="checkbox" value="remember-me">
            Remember me
        </label>
        <div class="control-group">
            <div class="controls">
                <label class="radio inline">
                    <input type="radio" name="optionsRadios" id="optionsRadios1" value="学生">
                    学生
                </label>
                <label class="radio inline">
                    <input type="radio" name="optionsRadios" id="optionsRadios2" value="教师" checked>
                    教师
                </label>
                <label class="radio inline">
                    <input type="radio" name="optionsRadios" id="Radio1" value="管理员">
                    管理员
                </label>
                <button id="button_login" class="btn btn-large btn-primary" type="submit">
                    登陆</button>
            </div>
        </div>
        </form>
    </div>
    <div id="footer">
        <div class="container">
            <p class="muted credit">
                学生成绩管理系统</p>
        </div>
    </div>
    <!-- /container -->
    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="./js/jquery.js"></script>
    <script src="./js/bootstrap.min.js"></script>
    <script src="js/messenger.min.js" type="text/javascript"></script>
    <script src="js/messenger-theme-future.js" type="text/javascript"></script>
    <script>
        //禁用表单提交
        $(document).ready(function () {
            //定义表单提交前与提交后的处理方法及超时相关
            $('form').submit(function () {
                return false;
            });
        });

        //登陆验证
        $("#button_login").click(function () {
            var username = $("#username").val();
            var password = $("#password").val();
            var params = {
                'action': 'validateUser',
                'username': username,
                'password': password,
                'rolename': $(":radio:checked").val()
            };
            $.post("./handler/LoginHandler.ashx", params, function (data, status) {
                if (data.checked == 'yes') {
                    $.globalMessenger().post("账号验证成功");
                    window.location = 'Index.html';
                } else {
                    $.globalMessenger().post("账号验证失败");
                }
            }, 'json');
        });
    </script>
</body>
</html>
